﻿/* ================================ *** 个性化模块 *** ================================ */
// ====================================================================================================
.pop-wraper-copy{
	.pop-container{.wh(90%,80%);.p_rel;.ox;.oy;}
	.pop-header{.box-shadow(0 2px 3px #bbb);.user-select}
	.pop-content:extend(.r5px){.p_abs_lt(10,36+10);.r(10);.bm(10);.bor(@border-color);.bc(fff);.os;
	   .box-shadow(0 0 5px #aaa);.oh(auto);
	}
}

.code-list-container{.w;.dt;.f12;.bc(#fdf7f2);.oh;.ar;.c_333;
    // .ff(monospace);
	&:extend(.bbsb,.r5px);
	dl{.dtd;
	   &:first-child{.w(20);.tc;.rbor(#6ce26c,2);.c(gray);}
	}
	dt,dd{.hh22;.nowrap;.plr10;
	   &:nth-child(2n){.bc_fff;}
	}
	dt{.user-select;.tr;}
	dd{.pre;
	    &:hover{.bc(#ead6c7);}
	}
	.code-aot-html,.code-aot-css-js{.c(#69a469);.i}
	.code-tag-js,.code-tag-link{.c(#083dc3);}
}
// =============================================================================== mvvm 框架
.mvvm-list{
    >*:extend(.font-icon){.db;}
    dt{.c(#d6487e);.f16;.lh28;.mb5;}
    dt:before:extend(.font-star:before){.mr10;}
    dd{.ml20;.p_rel;.pl20;.lh24;.mb5;}
    dd:before:extend(.font-angle-double-right:before){.c(#d6487e);.abs_lt;.h;}
}

.mvvm-box-1{.bor_ddd;.bc(#fef7ee);.hh(200);.fs(40);.plr20;.b;}
.mvvm-box-2{.bor_ddd;.bc(#fef7ee);.p20;.lh30;
    h3{.f20;.b;.mb10;.lh;}
}

.mvvm-code,.mvvm-pre{
    i{.c(#d6487e)}
    s{.c(blue);.tn;.ml15;}
    b{.c(#f00)}
}
.mvvm-pre{.lh22;.ar;}
